<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="/common/taglibs.jsp"%>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags"%>
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>部门</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
	<link rel="stylesheet" href="${ctxLayui}/layuiadmin/layui/css/layui.css" media="all">
	<link rel="stylesheet" href="${ctxLayui}/layuiadmin/style/admin.css" media="all">
	<link rel="stylesheet" href="${ctxLayui}/layuiadmin/style/myStyle.css" media="all">
</head>
<body>

<div class="layui-card layadmin-header">
	<div class="layui-breadcrumb" lay-filter="breadcrumb">
		<!--<a lay-href="">xx管理</a>-->
		<a><cite>部门</cite></a>
	</div>
</div>

<div class="layui-fluid">
	<div class="layui-card">
		<!--<div class="layui-collapse" lay-filter="component-panel">
			<div class="layui-colla-item">
				<h2 class="layui-colla-title">搜索条件</h2>
				<div class="layui-colla-content">
					<div class="layui-form layui-card-header layuiadmin-card-header-auto">
						<div class="layui-form-item">
							<div class="layui-inline layui-inline-31">
								<label class="layui-form-label">名称</label>
								<div class="layui-input-block">
									<input type="text" name="name" placeholder="" autocomplete="off" class="layui-input">
								</div>
							</div>
							<div class="layui-inline layui-inline-31">
								<label class="layui-form-label">部门类型</label>
								<div class="layui-input-block">
									<select name="type"  id="type" >
									</select>
								</div>
							</div>
							<div class="layui-inline layui-inline-31">
								<label class="layui-form-label">服务类型</label>
								<div class="layui-input-block">
									<select name="serviceType"  id="serviceType"   >
									</select>
								</div>
							</div>
							<div class="layui-inline layui-inline-31">
								<label class="layui-form-label">状态</label>
								<div class="layui-input-block">
									<select name="status"  id="status"  >
									</select>
								</div>
							</div>

							<div class="layui-inline layui-inline-8">
								<button class="layui-btn" lay-submit lay-filter="department-list-search">
									<i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
								</button>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>-->

		<div class="layui-card-body">
			<table class="layui-hide" id="departmentListTable" lay-filter="departmentListTable"></table>
			<div id="departmentListTable-toolbar-div" style="display: none;">
				<div class="layui-btn-container"  style="margin:10px 0 5px 0;">
					<button class="layui-btn layui-btn-sm" data-type="addRec">添加</button>
					<button class="layui-btn layui-btn-sm layui-btn-normal" data-type="syncData">同步企业微信</button>
				</div>
			</div>

			<script type="text/html" id="departmentListTable-bar">
				<a class="layui-btn layui-btn-xs" lay-event="editRec">编辑</a>
				<a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="delRec">删除</a>
			</script>

		</div>
	</div>

</div>
<script src="${ctxLayui}/layuiadmin/layui/layui.js"></script>
<script>
	layui.config({
		base: '${ctxLayui}/layuiadmin/'
	}).extend({
		index: 'lib/index'
	}).use(['index', 'table','dict','laydate','util','treeTable'], function(){
		var $ = layui.$,table = layui.table,form = layui.form;
		var dict = layui.dict;
		var laydate = layui.laydate;
		var admin = layui.admin;
		var util = layui.util;

        var treeTable = layui.treeTable;

		dict.setSelect("type","deptType");
		dict.setSelect("serviceType","deptServiceType");
		dict.setSelect("status","status");


		var tplType = function(d){
			var html = dict.showName("deptType",d.type);
			return html;
		};
		var tplServiceType = function(d){
			var html = dict.showName("deptServiceType",d.serviceType);
			return html;
		};
		var tplStatus = function(d){
			var html = dict.showName("status",d.status);
			return html;
		};

        var tableIns = treeTable.render({
            elem: '#departmentListTable',
            tree: {
                iconIndex: 1,  // 折叠图标显示在第几列
                idName: 'id',  // 自定义id字段的名称
                pidName: 'parentId',  // 自定义标识是否还有子节点的字段名称
            },
            cols: [
                {type: 'checkbox', fixed: 'left'},
                {type: 'numbers',width: 200,style:'text-align:left'},
                {field: 'id', title: 'ID',width: 100},
                {field:'name', title: '名称' }
                ,{field:'sortOrder', title: '排序',width:150}
                ,{field:'type', title: '部门类型', width:120,templet:tplType}
                ,{field:'serviceType', title: '服务类型', width:120,templet:tplServiceType}
                ,{field:'status', title: '状态', width:120,templet:tplStatus}
                ,{title:'操作', toolbar: '#departmentListTable-bar', width:180}
            ],
            reqData: function(data, callback) {
                // 在这里写ajax请求，通过callback方法回调数据
                var url = ctx+'/system/department/departmentTreeList';
                var rtn = admin.syncReq(url,{});
                var rtnData = rtn.data;
                for(var i=0;i<rtnData.length;i++){
                    var vo = rtnData[i];
                    vo.open = true;
                }
                callback(rtnData);

            }
        });

		var active = {
			addRec: function(parentId){
                parentId = parentId?parentId:0;
                var nodes = tableIns.checkStatus(false);
                if(nodes.length>=1 && parentId==0){
                    parentId = nodes[0].id;
                }
				window.formData = {};
                window.formData.parentId = parentId
				layer.open({
					type: 2
					,title: '用户信息'
					,content: 'departmentForm.jsp'
					,maxmin: true
					,area: layui.setter.area
					,btn: ['确定', '取消']
					,yes: function(index, layero){
						var iframeWindow = window['layui-layer-iframe'+ index]
							,submit = layero.find('iframe').contents().find("#layuiadmin-app-form-submit");
						iframeWindow.layui.form.on('submit(layuiadmin-app-form-submit)', function(data){
							var field = data.field;
							var rtn = admin.syncReq(ctx+"/system/department/add",field);
							if(rtn && rtn.code==0){
								layer.msg('操作成功');
								active.reload();
								form.render();
								layer.close(index);
                                active.showBtn();
							}else{
								layer.msg('操作失败');
							}
						});
						submit.trigger('click');
					}
				});
			},
			editRec:function(obj){
				var rec = obj.data;
				window.formData = null;
				layer.open({
					type: 2
					,title: '用户信息'
					,content: 'departmentForm.jsp'
					,maxmin: true
					,area: layui.setter.area
					,btn: ['确定', '取消']
					,success:function(layero,index){
						var body = layer.getChildFrame('body', index);
						var data = obj.data;
						window.formData = data;
						$.each(data,function(item){
							body.find("[name="+item+"]").val(data[item]);
						});
					}
					,yes: function(index, layero){
						var iframeWindow = window['layui-layer-iframe'+ index]
							,submit = layero.find('iframe').contents().find("#layuiadmin-app-form-edit");
						iframeWindow.layui.form.on('submit(layuiadmin-app-form-edit)', function(data){
							var field = data.field; 
							field.id = rec.id;
							var rtn = admin.syncReq(ctx+"/system/department/modify",field);
							if(rtn && rtn.code==0){
								layer.msg('操作成功');
								active.reload();
								form.render();
								layer.close(index);
                                active.showBtn();
							}else{
								layer.msg('操作失败');
							}
						});
						submit.trigger('click');
					}
				});
			},
			delRec:function (obj) {
                var rec = obj.data;
                tableIns.removeAllChecked();  // 移除全部选中
                tableIns.setChecked([rec.id]);
                var nodes = tableIns.checkStatus(false);
                layer.confirm('确定删除记录及其子节点?', function(index){
					var idArr = [];
					for(var i=0;i<nodes.length;i++){
                        idArr.push(nodes[i].id);
					}
					var rtn = admin.syncReq(ctx+"/system/department/deleteByBatch",{"ids":idArr.join(",")});
					if(rtn && rtn.code==0){
						layer.msg('操作成功');
						active.reload();
                        active.showBtn();
					}else{
						layer.msg('操作失败');
					}
				});
			},
			reload: function(){
                tableIns.reload();
			},
            syncData:function () {
                var rtn = admin.syncReq(ctx+"/system/department/synch",{});
                if(rtn && rtn.code==0){
                    layer.msg('操作成功');
                    active.reload();
                    active.showBtn();
                }else{
                    layer.msg('操作失败');
                }
            },
			showBtn:function () {
                $(".ew-tree-table-head .layui-table").html($("#departmentListTable-toolbar-div").html());
                $('.layui-btn-container .layui-btn').on('click', function(){
                    var type = $(this).data('type');
                    active[type] ? active[type].call(this) : '';
                });
            }
		};

		active.showBtn();

        treeTable.on('tool(departmentListTable)', function(obj){
			var data = obj.data;
			if(obj.event === 'editRec'){
				active.editRec(obj);
			}else if(obj.event === 'delRec'){
                active.delRec(obj);
            }
		});

	});
</script>
</body>
</html>
